image {
  background-color: #efefef;
}
.header {
  background-color: #393e46;
  box-sizing: border-box;
  position: relative;
  padding-top: 104rpx;
  padding-left: 20rpx;
  padding-right: 20rpx;
  padding-bottom: 20rpx;
  .notice {
    position: absolute;
    top: 20rpx;
    left: 0;
    width: 662rpx;
    height: 60rpx;
    background-color: #ea5455;
    border-top-right-radius: 30rpx;
    border-bottom-right-radius: 30rpx;
    box-sizing: border-box;
    display: flex;
    padding-left: 20rpx;
    padding-right: 20rpx;
    align-items: center;
    .icon-msg {
      width: 38rpx;
      height: 38rpx;
    }
    .icon-close {
      width: 50rpx;
      height: 50rpx;
      background-color: unset;
    }
  .notice-txt {
      flex: 1;
      padding-left: 20rpx;
      color: #FFF;
      font-size: 28rpx;
    }
  }
  .info {
    display: flex;
    .head-img {
      width: 124rpx;
      height: 124rpx;
      border-radius: 50%;
      border: #074cfe 2rpx solid;
    }
    .info-body {
      padding-left: 20rpx;
      padding-top: 20rpx;
      .name {
        color: #FFF;
        font-size: 32rpx;
        line-height: 1.5;
        font-weight: bold;
      }
      .warn {
        padding-top: 20rpx;
        display: flex;
        .icon-warn {
          background-color: #d9001b;
          width: 42rpx;
          height: 42rpx;
        }
        .warn-txt {
          padding-left: 20rpx;
          color: #faf02c;
          font-size: 28rpx;
        }
      }
      
    }
  }
  .tabs {
    box-sizing: border-box;
    padding-top: 35rpx;
    color: #FFF;
    display: flex;
    font-size: 38rpx;
    .tab {
      position: relative;
      width: 166rpx;
      text-align: center;
      padding-bottom: 10rpx;
      &.active::after {
        content: " ";
        display: block;
        position: absolute;
        left: 32rpx;
        right: 32rpx;
        top: 60rpx;
        border-bottom: #FFF 4rpx solid;
      }
    }
  }
  .msg {
    position: absolute;
    right: 44rpx;
    top: 106rpx;
  }
}
.app-list {
  box-sizing: border-box;
  padding: 30rpx;
  display: flex;
  flex-wrap: wrap;
  .app-item {
    padding-top: 30rpx;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-left: 80rpx;
    &:nth-child(4n+1) {
      margin-left: unset;
    }
    image {
      width: 104rpx;
      height: 104rpx;
      display: block;
      border-radius: 50%;
      background-color: #f49847;
    }
    text {
      padding-top: 10rpx;
      font-size: 28rpx;
      color: #333333;
    }
  }
}
.banner {
  height: 100rpx;
  background-color: #EFEFEF;
  border-top-left-radius: 30rpx;
  border-top-right-radius: 30rpx;
  overflow: hidden;
  image {
    width: 750rpx;
    height: 100rpx;
    background-color: #EFEFEF;
  }
}
.oa {
  position: relative;
  box-sizing: border-box;
  padding: 0 30rpx;
  display: flex;
  align-items: center;
  &::after {
    content: " ";
    display: block;
    position: absolute;
    left: 40rpx;
    right: 40rpx;
    border-bottom: #cbcbcb 2rpx solid;
    bottom: 0;
  }
  &:last-child::after {
    content: "";
    border-bottom: unset!important;
  }
  .oa-index {
    width: 42rpx;
    height: 42rpx;
    border-radius: 50%;
    flex-shrink: 0;
    text-align: center;
    line-height: 42rpx;
  }
  .oa-info {
    flex: 1;
    box-sizing: border-box;
    padding: 0 20rpx;
    height: 124rpx;
    align-items: center;
    justify-content: center;
    padding-top: 30rpx;
    position: relative;
    .oa-name {
      color: #333;
      font-size: 32rpx;
    }
    .promoter {
      color: #666666;
      font-size: 24rpx;
      flex: 1;
      text-align: right;
    }
  }
  .arrow {
    width: 40rpx;
    height: 40rpx;
    background-color: unset;
  }
}
.wipper-box {
  padding: 20rpx ;
}
.all-app {
  border-top: #f3f3f3 15rpx solid;
  box-sizing: border-box;
  .title {
    height: 70rpx;
    display: flex;
    align-items: center;
    color: #333;
    font-size: 34rpx;
    padding-top: 30rpx;
    padding-left: 30rpx;
    text {
      display: block;
      width: 14rpx;
      height: 40rpx;
      background-color: #2265fd;
      margin-right: 30rpx;
    }
  }
}